<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>后台管理系统-首页</title>
    <link rel="stylesheet" href="./assets/bootstrap/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="./assets/bootstrap-validator/css/bootstrapValidator.min.css"/>
    <link rel="stylesheet" href="./assets/nprogress/nprogress.css"/>
    <link rel="stylesheet" href="./css/index.css"/>
</head>
<body class="ad-body">
<!--侧边栏-->
<aside class="ad-aside">
    <!--logo-->
    <div class="ad-logo"><a href="./index.html">ITCAST</a></div>
    <!--用户-->
    <div class="ad-user">
        <img src="./images/default.png" alt=""/>
        <span>超级管理员</span>
    </div>
    <!--菜单-->
    <div class="ad-menu">
        <ul>
            <li class="user-manage"><a href="./userManage.html"><span class="glyphicon glyphicon-user"></span> 用户管理</a></li>
            <li class="ad-category">
                <a href="javascript:;"><span class="glyphicon glyphicon-list"></span> 分类管理</a>
                <div class="child" style="display: none">
                    <a href="./categoryFirst.html">一级分类</a>
                    <a href="./categorySecond.html">二级分类</a>
                </div>
            </li>
            <li class="pro-manage"><a href="./productManage.html"><span class="glyphicon glyphicon-tags"></span> 商品管理</a></li>
        </ul>
    </div>
</aside>
<!--内容-->
<section class="ad-section">
    <!--顶部导航-->
    <nav class="ad-nav clearfix">
        <a class="pull-left toggle-aside" data-menu href="javascript:;"><span class="glyphicon glyphicon-align-justify"></span></a>
        <a data-toggle="modal" data-target="#myModal" class="pull-right login-out" data-logout href="javascript:;">
    <span class="glyphicon glyphicon-log-out"></span>
</a>
    </nav>
    <!-- 主体内容 -->
    <div class="ad-container">
        <!--路径导航-->
        <ol class="breadcrumb">
            <li><a href="#">管理系统</a></li>
            <li class="active">首页</li>
        </ol>
        <!-- 图表部分 -->
        <div class="ad-content">
            <div class="ad-echart clearfix">
                <!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
                <!-- 左边的柱状图 -->
                <div class="pull-left" id="main" style="width: 600px;height:400px;"></div>
                <!-- 右边的饼状图 -->
                <div class="pull-left" id="main2" style="width: 450px;height:400px;"></div>
            </div>
        </div>
    </div>
</section>

<!-- 弹出的模态框 -->
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog modal-sm" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title text-info" id="myModalLabel">温馨提示</h4>
            </div>
            <div class="modal-body text-danger">
                <span class="glyphicon glyphicon-info-sign"></span>
                <span>您确定要退出后台管理系统吗？</span>
            </div>
            <div class="modal-footer">
                <button type="button" class="cancel-btn btn btn-primary" data-dismiss="modal">取消</button>
                <button type="button" class="sure-btn btn btn-warning">确定</button>
            </div>
        </div>
    </div>
</div>

<script src="./assets/jquery/jquery.min.js"></script>
<script src="./assets/bootstrap/js/bootstrap.min.js"></script>
<script src="./assets/bootstrap-validator/js/bootstrapValidator.min.js"></script>
<script src="./assets/nprogress/nprogress.js"></script>
<script src="./assets/echarts/echarts.min.js"></script>
<script src="./js/common.js"></script>
<script src="js/index.js"></script>
</body>
</html>